<template>
    <div :style="page!='view'?'width:1000px;height:600px;overflow:auto':''" >
      <!-- 判断显示组件 -->
      <!--{{x}}-{{y}}-{{customId}}-->
      <bar-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" :drawingList="drawingList" v-if="chartType == 'bar'"/>
      <line-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" :drawingList="drawingList" v-else-if="chartType == 'line'"/>
      <scatter-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" :drawingList="drawingList" v-else-if="chartType == 'scatter'"/>
      <double-bar-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" :drawingList="drawingList" v-else-if="chartType == 'doublebar'"/>
      <staggered-label-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" :drawingList="drawingList" v-else-if="chartType == 'staggeredLabel'"/>
      <cylinder-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" :drawingList="drawingList" v-else-if="chartType == 'cylinder'"/> 
      <top-bar-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" :drawingList="drawingList" v-else-if="chartType == 'topbar'"/> 
      <rate-bar-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" :drawingList="drawingList" v-else-if="chartType == 'rateBar'"/> 
      <paralle-bar-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" :drawingList="drawingList" v-else-if="chartType == 'parallebar'"/>
      <doubley-axis-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" :drawingList="drawingList" v-else-if="chartType == 'doubleyAxis'"/>
      <double-direction-bar-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" :drawingList="drawingList" v-else-if="chartType == 'doubleDirectionBar'"/>
      <single-column-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" :drawingList="drawingList" v-else-if="chartType == 'singleColumn'"/>
      <double-bar-time-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" :drawingList="drawingList" v-else-if="chartType == 'doublebartime'"/> 
      <three-d-bar-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" :drawingList="drawingList" v-else-if="chartType == 'threeDBar'"/> 
      <pie-line-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" :drawingList="drawingList" v-else-if="chartType == 'pieline'"/>
      <bar-pie-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" :drawingList="drawingList" v-else-if="chartType == 'barPie'"/>
      <line-bar-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" :drawingList="drawingList" v-else-if="chartType == 'linebar'"/>
      <map-bar-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" :drawingList="drawingList" v-else-if="chartType == 'mapbar'"/>     
      <normal-text :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" v-else-if="chartType == 'text'"/>
      <lamp-text :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" v-else-if="chartType == 'lamp'"/>     
      <date-text :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" v-else-if="chartType == 'date'"/>
      <image-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" v-else-if="chartType == 'img'"/>
      <q-rcode-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" v-else-if="chartType == 'qRcode'"/>
      <video-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" v-else-if="chartType == 'video'"/>
      <hyper-link-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" :zIndex="-1" v-else-if="chartType == 'hyperlink'"/>
      <iframe-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" :zIndex="1" v-else-if="chartType == 'iframe'"/>     
      <rotation-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" :zIndex="1" v-else-if="chartType == 'rotation'"/>          
      <word-cloud-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" :drawingList="drawingList" v-else-if="chartType == 'wordcloud'"/>
      <color-block-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" :drawingList="drawingList" v-else-if="chartType == 'colorBlock'"/>
      <twinkle-border-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" v-else-if="chartType == 'twinkleborder'"/>
      <around-border-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" v-else-if="chartType == 'aroundborder'"/>     
      <ray-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" v-else-if="chartType == 'ray'"/>
      <diffuseray-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" v-else-if="chartType == 'diffuseray'"/>     
      <midi-keyboard-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" v-else-if="chartType == 'midikeyboard'"/>     
      <voiceprint-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" v-else-if="chartType == 'voiceprint'"/>
      <stacked-bar-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" :drawingList="drawingList" v-else-if="chartType == 'stackedBar'"/>
      <shadow-line-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" :drawingList="drawingList" v-else-if="chartType == 'shadowLine'"/>
      <rain-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" :drawingList="drawingList" v-else-if="chartType == 'rain'"/>
      <table-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" :drawingList="drawingList" v-else-if="chartType == 'taBle'"/>
      <table-top-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" :drawingList="drawingList" v-else-if="chartType == 'tabletop'"/>    
      <table-rotation-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" :drawingList="drawingList" v-else-if="chartType == 'tablerotation'"/>
      <handson-table-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" v-else-if="chartType == 'handsontable'"/>      
      <input-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" :drawingList="drawingList" v-else-if="chartType == 'input'"/>
      <time-frame-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" :drawingList="drawingList" v-else-if="chartType == 'timeframe'"/>
      <timeline-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" :drawingList="drawingList" v-else-if="chartType == 'timeline'"/>    
      <cascade-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" :drawingList="drawingList" v-else-if="chartType == 'cascade'"/>
      <tab-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" :drawingList="drawingList" v-else-if="chartType == 'tab'"/>
      <pie-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" :drawingList="drawingList" v-else-if="chartType == 'pie'"/>
      <ring-pie-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" :drawingList="drawingList" v-else-if="chartType == 'ringPie'"/>
      <funnel-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" :drawingList="drawingList" v-else-if="chartType == 'funnel'"/>
      <radar-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" :drawingList="drawingList" v-else-if="chartType == 'radar'"/>
      <gauge-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" :drawingList="drawingList" v-else-if="chartType == 'gauge'"/>
      <keygauge-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" :drawingList="drawingList" v-else-if="chartType == 'keygauge'"/>
      <progress-gauge-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" :drawingList="drawingList" v-else-if="chartType == 'progauge'"/>
      <select-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" :drawingList="drawingList" v-else-if="chartType == 'select'"/>
      <map-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" :drawingList="drawingList" v-else-if="chartType == 'map'"/>
      <map-more-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" v-else-if="chartType == 'mapMore'"/>
      <three-d-map-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" :drawingList="drawingList" v-else-if="chartType == 'threedMap'"/>
      <backborder-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" v-else-if="chartType == 'backborder'"/>
      <water-ball-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" :drawingList="drawingList" v-else-if="chartType == 'waterball'"/>
      <water-ball-line-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" :drawingList="drawingList" v-else-if="chartType == 'waterballline'"/>
      <circle-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" :drawingList="drawingList" v-else-if="chartType == 'circle'"/>
      <flop-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" v-else-if="chartType == 'flop'"/>
      <pie-more-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" :drawingList="drawingList" v-else-if="chartType == 'piemore'"/>
      <progress-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" :drawingList="drawingList" v-else-if="chartType == 'progress'"/>
      <knowledge-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" :drawingList="drawingList" v-else-if="chartType == 'knowledge'"/>
      <pops-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" :drawingList="drawingList" v-else-if="chartType == 'pops'"/>
      <sunburst-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" :drawingList="drawingList" v-else-if="chartType == 'sunburst'"/>
      <text-check-box :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" :drawingList="drawingList" v-else-if="chartType == 'textCheckBox'"/>
      <custom-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" :drawingList="drawingList" v-else-if="chartType == 'customChart'"/>
      <custom-water-ball-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" :drawingList="drawingList" v-else-if="chartType == 'customWaterBall'"/>
      <scanning-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" v-else-if="chartType == 'scanning'"/>
      <turntable-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" v-else-if="chartType == 'turntable'"/>
      <galaxy-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" v-else-if="chartType == 'galaxy'"/>
      <boxline-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" :drawingList="drawingList" v-else-if="chartType == 'boxline'"/>
      <tian-di-map-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" v-else-if="chartType == 'tiandiMap'"/>
      <card-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" :drawingList="drawingList" v-else-if="chartType == 'card'"/>
      <pictorial-bar-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" :drawingList="drawingList" v-else-if="chartType == 'pictorialBar'"/>
      <sankey-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" :drawingList="drawingList" v-else-if="chartType == 'sankey'"/>
      <heatMap-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" :drawingList="drawingList" v-else-if="chartType == 'heatMap'"/>
      <custom-threeD-bar-chart :width="width + 'px'" :height="height + 'px'" :chartOption="chartOption" :className="chartOption.animate" :drawingList="drawingList" v-else-if="chartType == 'CustomThreeDBar'"/>
    </div>
</template>

<script>


import BarChart from '@/views/tool/datav/components/chart/BarChart'
import LineChart from '@/views/tool/datav/components/chart/LineChart'
import ScatterChart from '@/views/tool/datav/components/chart/ScatterChart'
import StaggeredLabelChart from '@/views/tool/datav/components/chart/StaggeredLabelChart'
import DoubleBarChart from '@/views/tool/datav/components/chart/DoubleBarChart'
import ParalleBarChart from '@/views/tool/datav/components/chart/ParalleBarChart'
import DoubleDirectionBarChart from '@/views/tool/datav/components/chart/DoubleDirectionBarChart'
import CylinderChart from '@/views/tool/datav/components/chart/CylinderChart'
import DoubleBarTimeChart from '@/views/tool/datav/components/chart/DoubleBarTimeChart'
import TopBarChart from '@/views/tool/datav/components/chart/TopBarChart'
import RateBarChart from '@/views/tool/datav/components/chart/RateBarChart'
import DoubleyAxisChart from '@/views/tool/datav/components/chart/DoubleyAxisChart'
import SingleColumnChart from '@/views/tool/datav/components/chart/SingleColumnChart'
import ThreeDBarChart from '@/views/tool/datav/components/chart/ThreeDBarChart'
import NormalText from '@/views/tool/datav/components/chart/NormalText'
import LampText from '@/views/tool/datav/components/chart/LampText'
import DateText from '@/views/tool/datav/components/chart/DateText'
import ImageChart from '@/views/tool/datav/components/chart/ImageChart'
import QRcodeChart from '@/views/tool/datav/components/chart/QRcodeChart'
import VideoChart from '@/views/tool/datav/components/chart/VideoChart'
import HyperLinkChart from '@/views/tool/datav/components/chart/HyperLinkChart'
import IframeChart from '@/views/tool/datav/components/chart/IframeChart'
import RotationChart from '@/views/tool/datav/components/chart/RotationChart'
import ColorBlockChart from '@/views/tool/datav/components/chart/ColorBlockChart'
import WordCloudChart from '@/views/tool/datav/components/chart/WordCloudChart'
import StackedBarChart from '@/views/tool/datav/components/chart/StackedBarChart'
import ShadowLineChart from '@/views/tool/datav/components/chart/ShadowLineChart'
import TableChart from '@/views/tool/datav/components/chart/TableChart'
import TableRotationChart from '@/views/tool/datav/components/chart/TableRotationChart'
import TableTopChart from '@/views/tool/datav/components/chart/TableTopChart'
import HandsonTableChart from '@/views/tool/datav/components/chart/HandsonTableChart'
import InputChart from '@/views/tool/datav/components/chart/InputChart'
import TimeFrameChart from '@/views/tool/datav/components/chart/TimeFrameChart'
import TimelineChart from '@/views/tool/datav/components/chart/TimelineChart'
import CascadeChart from '@/views/tool/datav/components/chart/CascadeChart'
import TabChart from '@/views/tool/datav/components/chart/TabChart'
import PieLineChart from '@/views/tool/datav/components/chart/PieLineChart'
import BarPieChart from '@/views/tool/datav/components/chart/BarPieChart'
import LineBarChart from '@/views/tool/datav/components/chart/LineBarChart'
import MapBarChart from '@/views/tool/datav/components/chart/MapBarChart'
import TwinkleBorderChart from '@/views/tool/datav/components/chart/TwinkleBorderChart'
import AroundBorderChart from '@/views/tool/datav/components/chart/AroundBorderChart'
import RayChart from '@/views/tool/datav/components/chart/RayChart'
import MidiKeyboardChart from '@/views/tool/datav/components/chart/MidiKeyboardChart'
import VoiceprintChart from '@/views/tool/datav/components/chart/VoiceprintChart'
import DiffuserayChart from '@/views/tool/datav/components/chart/DiffuserayChart'
import RainChart from '@/views/tool/datav/components/chart/RainChart'
import PieChart from '@/views/tool/datav/components/chart/PieChart'
import RingPieChart from '@/views/tool/datav/components/chart/RingPieChart'
import FunnelChart from '@/views/tool/datav/components/chart/FunnelChart'
import RadarChart from '@/views/tool/datav/components/chart/RadarChart'
import GaugeChart from '@/views/tool/datav/components/chart/GaugeChart'
import KeygaugeChart from '@/views/tool/datav/components/chart/KeygaugeChart'
import ProgressGaugeChart from '@/views/tool/datav/components/chart/ProgressGaugeChart'
import SelectChart from '@/views/tool/datav/components/chart/SelectChart'
import MapChart from '@/views/tool/datav/components/chart/MapChart'
import MapMoreChart from '@/views/tool/datav/components/chart/MapMoreChart'
import ThreeDMapChart from '@/views/tool/datav/components/chart/ThreeDMapChart'
import BackborderChart from '@/views/tool/datav/components/chart/BackborderChart'
import WaterBallChart from '@/views/tool/datav/components/chart/WaterBallChart'
import WaterBallLineChart from '@/views/tool/datav/components/chart/WaterBallLineChart'
import CircleChart from '@/views/tool/datav/components/chart/CircleChart'
import FlopChart from '@/views/tool/datav/components/chart/FlopChart'
import PieMoreChart from '@/views/tool/datav/components/chart/PieMoreChart'
import ProgressChart from '@/views/tool/datav/components/chart/ProgressChart'
import KnowledgeChart from '@/views/tool/datav/components/chart/KnowledgeChart'
import PopsChart from '@/views/tool/datav/components/chart/PopsChart'
import SunburstChart from '@/views/tool/datav/components/chart/SunburstChart'
import TextCheckBox from '@/views/tool/datav/components/chart/TextCheckBox'
import CustomChart from '@/views/tool/datav/components/chart/CustomChart'
import CustomWaterBallChart from '@/views/tool/datav/components/chart/CustomWaterBallChart'
import ScanningChart from '@/views/tool/datav/components/chart/ScanningChart'
import TurntableChart from '@/views/tool/datav/components/chart/TurntableChart'
import GalaxyChart from '@/views/tool/datav/components/chart/GalaxyChart'
import BoxlineChart from '@/views/tool/datav/components/chart/BoxlineChart'
import TianDiMapChart from '@/views/tool/datav/components/chart/TianDiMapChart'
import CardChart from '@/views/tool/datav/components/chart/CardChart'
import PictorialBarChart from '@/views/tool/datav/components/chart/PictorialBarChart'
import CustomThreeDBarChart from '@/views/tool/datav/components/chart/CustomThreeDBarChart'
import SankeyChart from '@/views/tool/datav/components/chart/SankeyChart'
import HeatMapChart from '@/views/tool/datav/components/chart/HeatMapChart'
export default {
  components: {
    BarChart, 
    LineChart,
    ScatterChart,
    DoubleBarChart,
    DoubleDirectionBarChart,
    CylinderChart,
    TopBarChart,
    RateBarChart,
    ParalleBarChart,
    DoubleyAxisChart,
    SingleColumnChart,
    DoubleBarTimeChart,
    ThreeDBarChart,
    NormalText,
    LampText,
    DateText,
    StackedBarChart,
    StaggeredLabelChart,
    ImageChart,
    QRcodeChart,
    VideoChart,
    HyperLinkChart,
    IframeChart,
    RotationChart,
    ColorBlockChart,
    WordCloudChart,
    ShadowLineChart,
    TableChart,
    TableRotationChart,
    TableTopChart,
    HandsonTableChart,
    InputChart,
    TimeFrameChart,
    TimelineChart,
    CascadeChart,
    TabChart,
    PieLineChart,
    BarPieChart,
    LineBarChart,
    MapBarChart,
    TwinkleBorderChart,
    AroundBorderChart,
    RayChart,
    MidiKeyboardChart,
    VoiceprintChart,
    DiffuserayChart,
    RainChart,
    PieChart,
    RingPieChart,
    FunnelChart,
    RadarChart,
    GaugeChart,
    KeygaugeChart,
    ProgressGaugeChart,
    MapChart,
    MapMoreChart,
    ThreeDMapChart,
    SelectChart,
    BackborderChart,
    WaterBallChart,
    WaterBallLineChart,
    CircleChart,
    FlopChart,
    PieMoreChart,
    ProgressChart,
    KnowledgeChart,
    PopsChart,
    SunburstChart,
    TextCheckBox,
    CustomChart,
    CustomWaterBallChart,
    ScanningChart,
    TurntableChart,
    GalaxyChart,
    BoxlineChart,
    TianDiMapChart,
    CardChart,
    PictorialBarChart,
    CustomThreeDBarChart,
    SankeyChart,
    HeatMapChart
  },
  props: ["dragchartdata", "drawingList","page"],
  data() {
    return {
      chartOption: this.dragchartdata.chartOption,
      chartType: this.dragchartdata.chartType,
      customId: this.dragchartdata.customId,
      width: this.dragchartdata.width,
      height: this.dragchartdata.height,
      x: this.dragchartdata.x,
      y: this.dragchartdata.y
    };
  },
  watch: {
    dragchartdata: {
      deep: true,
      handler(newVal) {
        //console.log('******',newVal)
        this.chartOption = newVal.chartOption,
        this.chartType = newVal.chartType,
        this.customId = newVal.customId,
        //this.width = newVal.width,
        //this.height = newVal.height,
        this.x = newVal.x,
        this.y = newVal.y,
        this.animate = newVal.animate
      }
    }
  },
  created(){

  },
  methods: {
    
  },
};
</script>

<style lang="scss">

</style>